<template>
  <div>
    <el-tabs type="border-card">
      <el-tab-pane label="User配置">
        <div>
          <r-search
            ref="search"
            :searchData="searchData"
            :searchForm="searchForm"
            :searchHandle="searchHandle"
            :searchRules="searchRules"
            :inline="false"
            labelWidth="180px"
            labelPosition="right"
          />
        </div>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
export default {
  name: "equipment_configuration",
  data() {
    return {
      searchData: {
        userToVipMoney: ""
      },
      searchForm: [
        {
          type: "input",
          label: "成为会员Recharge Amount",
          placeholder: "Please Enter",
          prop: "userToVipMoney",
          width: 200
        }
      ],
      searchHandle: [
        { type: "primary", label: "Save", handle: e => this.elFormSubmit() }
      ],
      searchRules: {
        outOfStockJz: [
          { required: true, message: "Please Enter", trigger: "blur" }
        ]
      }
    };
  },
  mounted() {
    this.getData();
  },
  methods: {
    async getData() {
      var res = await this.apis.getUserConfig({});
      this.searchData = res.data || {};
    },
    elFormSubmit() {
      this.$refs.search.$refs.ruleForm.validate(valid => {
        if (valid) {
          this.submit();
        }
      });
    },
    async submit() {
      var res = await this.apis.updateUserConfig({
        userToVipMoney: this.searchData.userToVipMoney
      });

      this.$message({
        message: "Operations Success",
        type: "success"
      });
    }
  }
};
</script>

<style scoped lang="scss"></style>
